<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="./css/style.css">
</head>

<body>
    <div class="header">
        Live Server
        <div></div>
        Web Extension

        <p>"Makes your existing server live"</p>
    </div>
    <div class="content">
        <div class="row">
            <label class="form-label" for="liveReloadCheck">Live Reload</label>
            <div class="tg-list">
                <div class="tg-list-item">
                    <input class="tgl tgl-ios" id="liveReloadCheck" type="checkbox" />
                    <label class="tgl-btn" for="liveReloadCheck"></label>
                </div>
            </div>
        </div>

        <div class="row">
            <div>
                <input type="checkbox" id="noProxyCheckBox">
                <label for="noProxyCheckBox">I don't want proxy setup (recommended)</label>
            </div>
        </div>

        <div id="serverSetup">
            <div class="row">
                <div>
                    <label class="form-label" for="actualServer">Actual Server Address</label>
                    <input class="form-control" type="text" id="actualServer" placeholder="http://Your Server Address">
                </div>
            </div>

            <div class="row">
                <div>
                    <label class="form-label" for="liveServer">Live Server Address</label>
                    <input class="form-control" type="text" id="liveServer" placeholder="Eg. http://127.0.0.1:5500/">
                    <a class="short-right-label" target="_blank" href="https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer">Install Live Server</a>
                </div>
            </div>
            <div class="row">
                <button class="btn" id="submitBtn" disabled>Apply</button>
            </div>
        </div>
    </div>
    <div class="footer">
        <a target="_blank" href="https://github.com/ritwickdey/live-server-web-extension">Need Help?</a>
        <p>NOTE: You need two server. Live Server will give `live` power of your existing server (May be Wamp, XAMPP, IIS
            or Node.js)</p>
    </div>
    <script src="./popup.js"></script>
</body>

</html>